import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../../utils/size_util.dart';
import '../controllers/home_controller.dart';

class HomeView extends GetView<HomeController> {
  const HomeView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 初始化自适应工具
    SizeUtil().init(context);
    
    return Scaffold(
      body: Stack(
        children: [
          // 主内容区域
          Positioned(
            top: 0,
            left: 0,
            right: 0,
            bottom: 98.h, // 底部菜单高度
            child: Container(
              color: Colors.grey[100],
              child: Center(
                child: Obx(() => Text(
                  '当前选中: ${controller.menuItems[controller.currentIndex]['title']}',
                  style: TextStyle(fontSize: 24.sp),
                )),
              ),
            ),
          ),
          
          // 底部菜单栏
          Positioned(
            bottom: 0,
            left: 0,
            right: 0,
            height: 98.h,
            child: Container(
              color: Colors.white,
              child: Row(
                children: [
                  // 菜单项列表
                  Expanded(
                    child: ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemCount: controller.menuItems.length,
                      itemBuilder: (context, index) {
                        return Obx(() => _buildMenuItem(index));
                      },
                    ),
                  ),
                  
                  // 右侧按钮
                  _buildActionButton('护理', Colors.blue, controller.onNursingPressed),
                  _buildActionButton('熄屏', Colors.orange, controller.onScreenOffPressed),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  // 构建菜单项
  Widget _buildMenuItem(int index) {
    bool isSelected = controller.currentIndex == index;
    
    return GestureDetector(
      onTap: () => controller.changeTab(index),
      child: Container(
        width: 120.w,
        height: 98.h,
        alignment: Alignment.center,
        decoration: BoxDecoration(
          border: Border(
            bottom: BorderSide(
              color: isSelected ? Colors.blue : Colors.transparent,
              width: 3.h,
            ),
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // 这里应该是图标，暂时用占位符
            Container(
              width: 32.w,
              height: 32.h,
              decoration: BoxDecoration(
                color: isSelected ? Colors.blue.withOpacity(0.2) : Colors.grey.withOpacity(0.2),
                shape: BoxShape.circle,
              ),
              child: Icon(
                _getIconForIndex(index),
                color: isSelected ? Colors.blue : Colors.grey,
                size: 20.sp,
              ),
            ),
            SizedBox(height: 8.h),
            Text(
              controller.menuItems[index]['title'],
              style: TextStyle(
                fontSize: 14.sp,
                color: isSelected ? Colors.blue : Colors.black,
                fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 构建右侧操作按钮
  Widget _buildActionButton(String title, Color color, VoidCallback onPressed) {
    return GestureDetector(
      onTap: onPressed,
      child: Container(
        width: 98.w,
        height: 98.h,
        color: color,
        alignment: Alignment.center,
        child: Text(
          title,
          style: TextStyle(
            color: Colors.white,
            fontSize: 16.sp,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }

  // 根据索引获取图标
  IconData _getIconForIndex(int index) {
    switch (index) {
      case 0: return Icons.home;
      case 1: return Icons.description;
      case 2: return Icons.attach_money;
      case 3: return Icons.health_and_safety;
      case 4: return Icons.local_hospital;
      case 5: return Icons.people;
      case 6: return Icons.notifications;
      case 7: return Icons.star;
      default: return Icons.circle;
    }
  }
}